<template>
	<div class="room-air-container">
		<div class="room-base-line">
			<div class="room-base-label">房间温度:</div>
			<span class="room-base-status">{{air.temp}}°C</span>
		</div>
		<div class="room-base-line">
			<div class="room-base-label">风速:</div>
			<el-select v-model="air.speed" placeholder="请选择" class="room-operation-box">
			    <el-option
			      	v-for="item in speedType"
			      	:label="item.label"
			      	:value="item.value">
			    </el-option>
		    </el-select>
		</div>
		<div class="room-base-line">
			<div class="room-base-label">模式:</div>
			<el-switch
			  	v-model="air.mode"
			  	class="room-operation-box"
			  	on-text="制冷"
			  	off-text="制热"
			  	off-color="#ff4949">
			</el-switch>
		</div>
	</div>
</template>

<style>
	.room-base-line {
		margin-top: 10px;
	}

	.room-operation-box {
		width: 100px;
		margin-left: 10px;
	}

	.room-base-status {
		margin-left: 10px;
	}
</style>

<script>
	import config from '../../config';
	import {mapGetters} from 'vuex';
	const speedType = config.speedType || [];

	export default {
		data() {
			return {
				speedType
			}
		},
		computed: {
			...mapGetters({
				air: 'airState'
			})
		},
		methods: {
			speedChange(value) {
				console.log(value);
			},
		}
	}
</script>